
function fn(x) {

 var img = document.querySelector(`#iot_${x}`)
 axios({
     url:'https://pcapi-xiaotuxian-front.itheima.net/home/banner',
     method:'get',
     params:{
        distributionSite:x,
     }
 }).then(result => {
      img.src= result.data.result[0].imgUrl;
 })
     
}
fn(1);fn(2);fn(3);fn(4);fn(5);fn(50)
var ul = document.querySelector('#iot_guanggao');
var startX = 0;
var moveX = 0;
var index = 0;
ul.addEventListener('touchstart',function (e) {
    startX =e.targetTouches[0].pageX;
});
ul.addEventListener('touchmove',function (e) {
    moveX =e.targetTouches[0].pageX-startX;
    var translatex = moveX;
    ul.style.transform = 'translateX('+ translatex + 'px)';
});
ul.addEventListener('touchend',function (e) {
    if(index>2){
        index=2;
    }
    if(index<0){
        index=0;
    }
        if (Math.abs(moveX)>50){
            if(moveX>0){
                index--;
            }
            else{
                index++;
            }
            var translatex = -index*414;
            // console.log(index);
            ul.style.transform = 'translateX('+ translatex + 'px)';
            ul.style.transition = 'all .3s';
        }
});

function png(y) {

    var tu = document.querySelector(`#iot_${y}`)
    var qian = document.querySelector(`.iot_${y}`)
    axios({
        url:'https://pcapi-xiaotuxian-front.itheima.net/home/category/mutli',
        method:'get',
    }).then(result => {
        // console.log(result);
         tu.innerHTML=result.data.result[y-6].name;
         qian.src=result.data.result[y-6].icon;

    })
        
   }
// png(6);png(7);png(8);png(9);png(10);png(11);png(12);png(13);png(14);png(15);
for(var o=6;o<16;o++){
    png(o)
}

 var p = 1;
 var w = 1;
 var g;
 function cn(){
 var xihuan = document.querySelectorAll('.iot_sangping1 li a img')
 var jiesao = document.querySelectorAll('.iot_sangping1 li a div')
 var jiage  = document.querySelectorAll('.iot_sangping1 li a span')
 axios({
     url:'https://pcapi-xiaotuxian-front.itheima.net/home/goods/guessLike',
     method:'get',
     params :{
         page:w,
     }
 }).then(result => {
     // console.log(result);
     for(var i=0; i <10;i++){
     xihuan[i+(w-1)*10].src = result.data.result.items[i].picture;
     jiesao[i+(w-1)*10].innerHTML = result.data.result.items[i].name;
     jiage[i+(w-1)*10].innerHTML ='￥' +result.data.result.items[i].price;
     // console.log(i);
     // console.log(i-p);
     }
     // console.log(result);
     // console.log(xihuan);
     w=w+1;
     g=w
 }); 
 }
 cn();
 var jiazai;
jiazai=setInterval(function  bn() {
     var sangping=document.querySelector('.iot_sangping1')
     let clientHeight  = document.querySelector('.iot_home1').clientHeight; //浏览器高度
     let scrollHeight = document.querySelector('.iot_home1').scrollHeight;
     let scrollTop = document.documentElement.scrollTop;    
    //  console.log(clientHeight);
    //  console.log(scrollHeight);
    //  console.log(scrollTop);
     if ((scrollTop + clientHeight) >= (scrollHeight+200)) {
         for(j=0;j<10;j++){
             let li = document.createElement("li")
             let a = document.createElement("a")
             let img = document.createElement("img")
             let div = document.createElement("div")
             let span = document.createElement("span")
             var sangpingzi=sangping.appendChild(li)
             var azi =sangpingzi.appendChild(a)
             azi.appendChild(img)
             azi.appendChild(div)
             azi.appendChild(span)
         };
         cn();}
 },1)
 var lisst = document.querySelector('.iot_dibu')
 lisst.onclick=function(){
    clearInterval(jiazai)
 }






 
// var iot_dibu1= document.querySelectorAll('.iot_dibuul')
// console.log(iot_dibu1);
var lis = document.querySelector('.iot_dibuul').children
var liss = document.querySelectorAll('#iot_zhuye')
var num3 = 0;
var jiazai1;
var jiazai2;
var jiazai3;
// console.log(liss);
// console.log(lis);
var f = 1;
for(var h = 0;h<lis.length;h++){
    lis[h].onclick=function(){
        for(var i =0 ; i<lis.length;i++){
            lis[i].className ='iot_xuanxiang' 
        }
        this.className='iot_xuanxiang on' 
        var index=this.getAttribute('date-id')
        // console.log(index);
         for(var t =0 ; t<liss.length;t++){
             liss[t].classList.remove('active')
         }
        liss[index].classList.add('active')
        var num =index
    num3=num;
    // console.log(num3);
    clearInterval(jiazai)
    clearInterval(jiazai1)
    clearInterval(jiazai2)
    clearInterval(jiazai3)
    if(num3 == 0){
        // console.log(g);
        function ccn(){
        var xihuan = document.querySelectorAll('.iot_sangping1 li a img')
        var jiesao = document.querySelectorAll('.iot_sangping1 li a div')
        var jiage  = document.querySelectorAll('.iot_sangping1 li a span')
        axios({
            url:'https://pcapi-xiaotuxian-front.itheima.net/hot/preference',
            method:'get',
            params :{
                page:g,
            }
        }).then(result => {
            // console.log(g);
            // console.log(result);
            for(var i=0; i <10;i++){
            xihuan[i+(g-1)*10].src = result.data.result.subTypes[0].goodsItems.items[i].picture
            jiesao[i+(g-1)*10].innerHTML = result.data.result.subTypes[0].goodsItems.items[i].name
            jiage[i+(g-1)*10].innerHTML ='￥' +result.data.result.subTypes[0].goodsItems.items[i].price
            // console.log(i);
            // console.log(i-p);
            }
            // console.log(result);
            // console.log(xihuan);
            g=g+1;
        }); 
        }
              
         jiazai1=setInterval(function  bbn() {
            var sangping2=document.querySelector('.iot_sangping1')
            let clientHeight1  = document.querySelector('.iot_home1').clientHeight; //浏览器高度
            let scrollHeight1 = document.querySelector('.iot_home1').scrollHeight;
            let scrollTop1 = document.documentElement.scrollTop;   
           if ((scrollTop1 + clientHeight1) >= (scrollHeight1+200)) {
               for(j=0;j<10;j++){
                   let li = document.createElement("li")
                   let a = document.createElement("a")
                   let img = document.createElement("img")
                   let div = document.createElement("div")
                   let span = document.createElement("span")
                   var sangpingzi=sangping2.appendChild(li)
                   var azi =sangpingzi.appendChild(a)
                   azi.appendChild(img)
                   azi.appendChild(div)
                   azi.appendChild(span)
               };
                     ccn()
                  }
       },1)
    }
      if(num3 == 2){
         function aan(){
         var xihuan1 = document.querySelectorAll('.iot_sangping11 li a img')
         var jiesao1 = document.querySelectorAll('.iot_sangping11 li a div')
         var jiage1  = document.querySelectorAll('.iot_sangping11 li a span')
         axios({
             url:'https://pcapi-xiaotuxian-front.itheima.net/hot/preference',
             method:'get',
             params :{
                 page:p,
             }
         }).then(result => {
            console.log(p);
             // console.log(result);
             for(var j=0; j<10;j++){
             xihuan1[j+(p-1)*10].src = result.data.result.subTypes[1].goodsItems.items[j].picture
             jiesao1[j+(p-1)*10].innerHTML = result.data.result.subTypes[1].goodsItems.items[j].name
             jiage1[j+(p-1)*10].innerHTML ='￥' +result.data.result.subTypes[1].goodsItems.items[j].price
             // console.log(i);
             // console.log(i-p);
             }
             // console.log(result);
             // console.log(xihuan);
             p=p+1;
    
         }); 
         }
                aan()
          jiazai2=setInterval(function  ddn() {
            var sangping2=document.querySelector('.iot_sangping11')
            let clientHeight2  = document.querySelector('.home2').clientHeight; //浏览器高度
            let scrollHeight2 = document.querySelector('.iot_xihuan3').scrollHeight;
            let scrollTop2 = document.documentElement.scrollTop;   
            //  console.log(clientHeight2);
            //  console.log(scrollHeight2);
            //  console.log(scrollTop2);
            if ((scrollTop2 + clientHeight2) >= (scrollHeight2+530)) {
                for(q=0;q<10;q++){
                    let li = document.createElement("li")
                    let a = document.createElement("a")
                    let img = document.createElement("img")
                    let div = document.createElement("div")
                    let span = document.createElement("span")
                    var sangpingzi=sangping2.appendChild(li)
                    var azi =sangpingzi.appendChild(a)
                    azi.appendChild(img)
                    azi.appendChild(div)
                    azi.appendChild(span)
                };
                    aan()
                }
       },1)
     }
     if(num3 == 3){
        function aaan(){
        var xihuan2 = document.querySelectorAll('.iot_sangping111 li a img')
        var jiesao2 = document.querySelectorAll('.iot_sangping111 li a div')
        var jiage2  = document.querySelectorAll('.iot_sangping111 li a span')
        axios({
            url:'https://pcapi-xiaotuxian-front.itheima.net/hot/preference',
            method:'get',
            params :{
                page:f,
            }
        }).then(result => {
           console.log(t);
            // console.log(result);
            for(var j=0; j<10;j++){
            xihuan2[j+(f-1)*10].src = result.data.result.subTypes[1].goodsItems.items[j].picture
            jiesao2[j+(f-1)*10].innerHTML = result.data.result.subTypes[1].goodsItems.items[j].name
            jiage2[j+(f-1)*10].innerHTML ='￥' +result.data.result.subTypes[1].goodsItems.items[j].price
            // console.log(i);
            // console.log(i-p);
            }
            // console.log(result);
            // console.log(xihuan);
            f=f+1;
   
        }); 
        }
            aaan()
         jiazai3=setInterval(function  dddn() {
           var sangping3=document.querySelector('.iot_sangping111')
           let clientHeight3  = document.querySelector('.home3').clientHeight; //浏览器高度
           let scrollHeight3 = document.querySelector('.iot_xihuan4').scrollHeight;
           let scrollTop3 = document.documentElement.scrollTop;   
            // console.log(clientHeight3);
            // console.log(scrollHeight3);
            // console.log(scrollTop3);
         if ((scrollTop3 + clientHeight3) >= (scrollHeight3-3)) {
             for(q=0;q<10;q++){
                 let li = document.createElement("li")
                 let a = document.createElement("a")
                 let img = document.createElement("img")
                 let div = document.createElement("div")
                 let span = document.createElement("span")
                 var sangpingzi=sangping3.appendChild(li)
                 var azi =sangpingzi.appendChild(a)
                 azi.appendChild(img)
                 azi.appendChild(div)
                 azi.appendChild(span)
             };
                  aaan()}
      },1)
    }

    }
}
// console.log(fenleizuo);
var fenlei = document.querySelector('.iot_fenleiyou')
axios({
    url:'https://pcapi-xiaotuxian-front.itheima.net/category/top',
    method:'get',
    params:{
    }
}).then(result => {
    // console.log(result);
    var h = result.data.result[0].children
    for(var i = 0 ; i < h.length ;i++){
        var g = result.data.result[0].children[i].goods
        let div = document.createElement("div")
        fenlei.appendChild(div)
        div.innerHTML=result.data.result[0].children[i].name
        div.className='c'
        let ul = document.createElement("ul")
        ul.className='ull'
        var ps = fenlei.appendChild(ul)
        for (var r = 0; r < g.length ; r++){
            let li = document.createElement("li")
            li.classList='a1'
            let a = document.createElement("a")
            a.classList='a2'
            let img = document.createElement("img")
            img.classList='a3'
            let div = document.createElement("div")
            div.classList='a4'
            let span = document.createElement("span")
            span.classList='a5'
            img.src=result.data.result[0].children[i].goods[r].picture
            div.innerHTML = result.data.result[0].children[i].goods[r].name
            span.innerHTML = '￥'+result.data.result[0].children[i].goods[r].price
            var sangpingzi=ps.appendChild(li)
            var azi =sangpingzi.appendChild(a)
            azi.appendChild(img)
            azi.appendChild(div)
            azi.appendChild(span)
        }
    }
})


var lis1 = document.querySelector('.iot_fenleizuo')
var lis2 = lis1.querySelectorAll('li')
// console.log(lis2);
for(var h = 0;h<lis2.length;h++){
    lis2[h].onclick=function(){
        for(var i =0 ; i<lis2.length;i++){
            lis2[i].className ='iot_ ' 
        }
        this.className='iot_ it' 
        var n = parseInt(this.getAttribute('data-id'))
        // console.log(n);
        var fenlei1 = document.querySelector('.iot_fenleiyou')
        var cc = document.querySelectorAll('.c')
        for(var e = 0 ; e < cc.length ; e++){
            var www = document.querySelector('.c')
            var fff = document.querySelector('.ull')
            console.log(fff);
            www.remove();
            fff.remove();
        }
        var aa = document.querySelectorAll('.a3')
        for(var l = 0 ; l<aa.length;l++){
            var aaa = document.querySelector('.a3')
            var bbb = document.querySelector('.a4')
            var ccc = document.querySelector('.a5')
            var ddd = document.querySelector('.a2')
            var eee = document.querySelector('.a1')
            aaa.remove();
            bbb.remove();
            ccc.remove();
            ddd.remove();
            eee.remove();
        }
    //    document.querySelectorAll('.a4')
    //    document.querySelectorAll('.a5')
    //    document.querySelectorAll('.a2')
    //    document.querySelectorAll('.a1')
    //    document.querySelectorAll('.ull')
    //    aa.removeChild(bb)
    //    aa.removeChild(dd)
    //    aa.removeChild(ee)
    //    aa1.removeChild(aa)
    //    ull1.removeChild(aa1)
        axios({
            url:'https://pcapi-xiaotuxian-front.itheima.net/category/top',
            method:'get',
            params:{
            }
        }).then(result => {
            console.log(result);
            var h = result.data.result[n].children
            // console.log(h);
            for(var i = 0 ; i < h.length ;i++){
                var g = result.data.result[n].children[i].goods
                let div = document.createElement("div")
                fenlei1.appendChild(div)
                div.innerHTML=result.data.result[n].children[i].name
                div.className='c'
                let ul = document.createElement("ul")
                var ps = fenlei1.appendChild(ul)
                ps.className='ull'
                for (var r = 0; r < g.length ; r++){
                    let li = document.createElement("li")
                    li.classList='a1'
                    let a = document.createElement("a")
                    a.classList='a2'
                    let img = document.createElement("img")
                    img.classList='a3'
                    let div = document.createElement("div")
                    div.classList='a4'
                    let span = document.createElement("span")
                    span.classList='a5'
                    img.src=result.data.result[n].children[i].goods[r].picture
                    div.innerHTML = result.data.result[n].children[i].goods[r].name
                    span.innerHTML = '￥'+result.data.result[n].children[i].goods[r].price
                    var sangpingzi=ps.appendChild(li)
                    var azi =sangpingzi.appendChild(a)
                    azi.appendChild(img)
                    azi.appendChild(div)
                    azi.appendChild(span)
                }
            }

        })
    }
}

axios({
    url:'https://pcapi-xiaotuxian-front.itheima.net/goods',
    method:'get',
    params:{
       id :4000914
    }
}).then(result1 => {
    console.log(result1);
})
    



        


	

